<div id="customerFilling">
    <link rel="stylesheet" type="text/css" href="pages/example/custCenter/customerFilling.css"/>
    <yu-panel title="客户建档">
        <yu-xform ref="customerInfoSearch" related-table-name="khtable" form-type="search"
                  :custom-search-fn="searchFn">
            <yu-xform-group :column="3">
                <yu-xform-item label="客户名称" placeholder="客户名称" name="custName"
                               ctype="input"></yu-xform-item>
                <yu-xform-item label="证件号码" placeholder="证件号码" name="ctfNo"
                               ctype="input"></yu-xform-item>
                <yu-xform-item label="客户等级" placeholder="客户等级" name="custLevel" data-code="CUST_LEVEL"
                               ctype="select"></yu-xform-item>
                <yu-xform-item v-if="judgeUser" @change="changeCustOrgId" label="归属机构" placeholder="归属机构" :options="options1" ctype="select"
                               name="custOrgId"></yu-xform-item>
                <yu-xform-item label="归属网格" placeholder="归属网格" :options="options2" ctype="select"
                               name="custGridId"></yu-xform-item>
<!--                <yu-xform-item label="网格级别" placeholder="网格级别" name="girdLevel"-->
<!--                               data-code="GRID_LEVEL"-->
<!--                               ctype="select"></yu-xform-item>-->
            </yu-xform-group>
        </yu-xform>
            <div style="justify-content:space-between;display: flex">
                <div>
                    <yu-button type="warning" @click="lookupInformation()" >查询基本信息</yu-button>
                    <yu-button type="danger" @click="addCustFn()" >新增</yu-button>
                    <yu-button type="success" @click="getCustomerInformation()" >修改</yu-button>
                    <yu-button type="danger" @click="deleteCustomer()" >删除</yu-button>
                    <yu-button type="success" @click="importFn()" >批量导入</yu-button>
                    <yu-button type="success" @click="openProcessApprovalFn()" >客户移交</yu-button>
                </div>
            </div>
            <div style="height: 30px"></div>
            <yu-xtable ref="khtable" :base-params="custData" :data-url="funcDataUrl" request-type="get" row-number style="width: 100%" selection-type="checkbox">
                <yu-xtable-column prop="custName" label="客户名称"  align="center" show-overflow-tooltip></yu-xtable-column>
                <yu-xtable-column prop="gridName" label="归属机构" align="center" show-overflow-tooltip></yu-xtable-column>
                <yu-xtable-column prop="custLevel" label="客户等级" align="center" data-code="CUST_LEVEL" show-overflow-tooltip></yu-xtable-column>
                <yu-xtable-column prop="ctfTp" label="证件类型"  align="center" data-code="CARD_TYPE" show-overflow-tooltip></yu-xtable-column>
                <yu-xtable-column prop="ctfNo" label="证件号码"  align="center" width="170px"   show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.ctfNo? scope.row.ctfNo.replace(/^(.{14})(?:\w+)(.{0})$/,
                        "\$1****\$2"):""}}
                    </template>
                </yu-xtable-column>
                <yu-xtable-column prop="mobNo" label="联系电话" align="center" show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.mobNo? scope.row.mobNo.replace(/^(.{7})(?:\w+)(.{0})$/,
                        "\$1****\$2"):""}}
                    </template>
                </yu-xtable-column>
                <yu-xtable-column prop="address" label="联系地址"  align="center" show-overflow-tooltip></yu-xtable-column>
                <yu-xtable-column prop="isImport" label="重点客户"  width="170px" align="center" >
                    <div slot-scope="scope" style="cursor: pointer" @click="updateImport(scope.row.isImport,scope.row.custNo)">
                        <img v-if="scope.row.isImport == '1'" src="themes/common/images/isImport.png" width="18px" height="18px" />
                        <img v-else="scope.row.isImport == '0'" src="themes/common/images/unImport.png" width="18px" height="18px" />
                    </div>
                </yu-xtable-column>
            </yu-xtable>
    </yu-panel>
    <!-- 文件导入弹框-->
    <el-dialog title="导入" :visible.sync="importDialogVisible" height="270px" center width="20%" @close="closeDialog()">
        <div style="height: 180px;display: flex;align-items: center;padding-left:200px">
            <div class="chooseFileDiv">选择文件:</div>
            <div>
                <yu-upload :data="uploadData" class="upload-demo" :headers="headers" ref="upload" multiple :action="action" :on-success="onSuccess" :auto-upload="false"
                           :on-error="onError">
                    <yu-button slot="trigger" class="chooseButton">请选择</yu-button>
                </yu-upload>
            </div>
        </div>
        <div class="yu-grpButton">
            <yu-button type="primary" v-loading="loading" @click="submitUpload">上传</yu-button>
        </div>
    </el-dialog>
    <!-- 移交信息-->
    <el-dialog :center="true" title="客户移交" :visible.sync="processApprovalDialogVisible" position="relative" @close="closeProcessDialog()" >
        <div style="display: flex;height: auto;position: relative;transition: all .5s;flex-direction: column">
            <yu-xform  ref="processApprovalForm"  label-width="110px" :rules="processApprovalRules" v-model="processApprovalInfo">
                <yu-xform-group :column="2">
                    <yu-xform-item label="地址" placeholder="地址"  name="address" ctype="input"></yu-xform-item>
                    <yu-xform-item label="证件号码" placeholder="证件号码"  name="ctfNo" ctype="input"></yu-xform-item>
                </yu-xform-group>
            </yu-xform>
            <div slot="footer" class="dialog-footer" align="center">
                <el-button v-loading="loading" type="primary" @click="processFunc()">移交</el-button>
            </div>
        </div>
    </el-dialog>
    <!-- 新增客户弹框-->
    <el-dialog :center="true" title="客户信息" :visible.sync="dialogFormVisible" position="relative" >
        <div style="display: flex;height: auto;position: relative;transition: all .5s;flex-direction: column">
            <yu-xform :disabled="formDisabled" ref="custForm"  label-width="110px" :rules="rules" v-model="custInfo">
                <yu-xform-group :column="2">
                    <yu-xform-item label="客户名称" placeholder="客户名称"  name="custName" ctype="input">
						<div slot-scope="scope" style="cursor: pointer"  @click="toCustView(scope.row)">
						    <div style="color: #0835ff;">{{scope.row.custName}}</div>
						</div>
					</yu-xform-item>
                    <yu-xform-item label="证件类型" placeholder="请选择"  name="ctfTp" ctype="select" data-code="CARD_TYPE"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="2">
                    <yu-xform-item label="证件号码" placeholder="证件号码"  name="ctfNo" ctype="input"></yu-xform-item>
                    <yu-xform-item label="性别" placeholder="请选择" name="gndrCd" ctype="select" data-code="SEX_TYPE"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="2">
                    <yu-xform-item label="职业" placeholder="请选择" name="ocpCd" ctype="select" :data-code="dialogStatus === 'add'? 'BIG_OCP_CD' :'OCP_CD'"></yu-xform-item>
                    <yu-xform-item label="手机号码" placeholder="手机号码" name="mobNo" ctype="input"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="1">
                    <yu-xform-item label="联系地址" placeholder="联系地址" name="address" ctype="input"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="1">
                    <yu-xform-item label="行业" placeholder="请选择" name="entpIdyCgy" :data-code="dialogStatus === 'add'? 'BIG_BLG_IDY' :'BLG_IDY'" ctype="select"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="2">
                    <yu-xform-item label="场景类型" placeholder="场景类型" ctype="select"
                                   name="sceneType" data-code="SCENE_TYPE"></yu-xform-item>
                    <yu-xform-item label="栋/组" placeholder="请输入内容" :unit="custInfo.sceneType == 1 ? '组': custInfo.sceneType === '0' ? '栋' :''"
                                   ctype="input" name="witchTypeValue"></yu-xform-item>
                </yu-xform-group>
            </yu-xform>
            <div slot="footer" class="dialog-footer" align="center">
                <el-button v-if="saveBtnShow" type="primary" @click="saveEditFunc()">保存</el-button>
                <el-button v-if="saveBtnShow" @click="restInputValue()">取消</el-button>
            </div>
        </div>
    </el-dialog>
</div>
